<template>
	<view class="u-m-20 bg-white rounded-10">
		<view class="u-m-20">
			<view class="flex" v-for="(item,index) in list" :key="index">
				<order-item-list-good :item="item"></order-item-list-good>
			</view>
		</view>
		<view class="u-p-x-30">
			<u-form :model="form" ref="uForm" labelWidth="150">
				<!-- 按单个商品售后 -->
				<template v-if="type == 1">
					<!-- 退款 -->
					<u-form-item label="售后方式"><u-input v-model="form.type" :disabled="true" placeholder="选择售后方式" type="select" @click="show = true"/></u-form-item>
					<view v-show="form.type == '退款' || form.type == '退款退货'">
						<u-form-item label="退款原因"><u-input v-model="form.refundreason" :disabled="true" placeholder="选择退款原因" type="select" @click="show1 = true"/></u-form-item>
						<u-form-item label="退款金额"><u-input v-model="pay_price" :disabled="true" /></u-form-item>
						<u-form-item label="退款说明"><u-input v-model="form.reason" placeholder="选填"/></u-form-item>
					</view>
					<view v-show="form.type == '换货'">
						<u-form-item label="换货原因"><u-input v-model="form.refundreason" :disabled="true" placeholder="选择换货原因" type="select" @click="aaaa"/></u-form-item>
					</view>
				</template>
				<!-- 按订单售后 -->
				<template v-else>
					<u-form-item label="售后方式"><u-input v-model="form.type" :disabled="true" placeholder="退款"/></u-form-item>
					<u-form-item label="退款原因"><u-input v-model="form.refundreason" :disabled="true" placeholder="选择退款原因" type="select" @click="show1 = true"/></u-form-item>
					<u-form-item label="退款金额"><u-input v-model="pay_price" :disabled="true" /></u-form-item>
					<u-form-item label="退款说明"><u-input v-model="form.reason" placeholder="选填"/></u-form-item>
				</template>
				<u-form-item label="上传凭证"><u-input placeholder="最多上传5张" :disabled="true"/></u-form-item>
			</u-form>
			<u-upload :auto-upload="false" ref="uUpload" :file-list="fileList" maxCount="5"></u-upload>
			<view class="u-p-y-30 text-center">
				<dy-button width="576rpx" size="default" @click="sure">提交申请</dy-button>
			</view>
		</view>
		<u-select v-model="show" :list="typeList" @confirm="confirm"></u-select>
		<u-select v-model="show1" :list="refundreasonlist" @confirm="confirm1" label-name="text"></u-select>
	</view>
</template>

<script>
	import { OrderCenterApi } from '@/api/serves.js'
	import { mapActions } from 'vuex'
	export default {
		data() {
			return {
				show: false,
				typeList: [
					// {
					// 	value: '1',
					// 	label: '退款'
					// },
					{
						value: '2',
						label: '退款退货'
					},
					{
						value: '3',
						label: '换货'
					},
				],
				show1: false,
				refundreasonlist: [],
				fileList: [],
				type: '',
				goods_id: '',
				order_no: '',
				list: [],
				form: {
					type: '',
					refundreason: '',
					reason: ''
				},
				pay_price: '',
				image: ''
			}
		},
		onLoad(options) {
			console.log(options);
			let info = JSON.parse(options.info)
			this.type = info.type
			if(this.type==1){
				this.form.type = '退款退货' 
			}else{
				this.form.type = '退款' // 只能选择退款
			}
			this.goods_id = info.goods_id
			this.order_no = info.order_no
			this._orderDetail()
			this._rufundInfo()
		},
		methods: {
			aaaa(e) {
				console.log(9959599595);
				this.$nextTick(()=>{
					this.show1 = true
				})
			},
			...mapActions({	upload:'user/upload'}),
			_orderDetail() {
				this.$ShowLoading()
				OrderCenterApi.orderDetail({ order_no: this.order_no }).then(res => {
					this.$HideLoading()
				  console.log('订单详情', res);
					if(res.code == 1){
						this.pay_price = '¥' + res.data.order.pay_price
						if(this.type == 1) {
							for (let item of res.data.order.goods) {
								if(item.goods_id == this.goods_id) {
									this.list = [item]
									break
								}
							}
						}else if (this.type == 2) {
							this.list = res.data.order.goods
							console.log(this.list);
						}
					}
				})
			},
			// 退款理由
			_rufundInfo(){
				OrderCenterApi.rufund_info().then(res=>{
					console.log('退款理由' , res)
					if(res.code==1){
						this.refundreasonlist = res.data.refundreasonlist
					}
				})
			},
			// 提交
			sure() {
				if(!this.form.type) return this.$Toast('请选择售后方式')
				if(!this.form.refundreason && this.form.type =='退款') return this.$Toast('请选择退款原因')
				if(!this.form.refundreason && this.form.type =='退款退货') return this.$Toast('请选择退款原因')
				if(!this.form.refundreason && this.form.type =='换货') return this.$Toast('请选择换货原因')
				let files = this.$refs.uUpload.lists
				// if(files.length<=0) return this.$Toast('图片上传失败')
				this.upload(files).then(res=> {
					console.log(899898, res);
					let params = {
						...this.form,
						order_no: this.order_no,
						image: this.image
					}
					if(res.length>0) params.image = res.length == 1 ? res[0]: res.join(',')
					if(this.form.type == '退款') return this.apply(1, params)
					if(this.form.type == '退款退货') return this.apply(2, params)
					if(this.form.type == '换货') return this.apply(3, params)
				})
			},
			// 提交申请
			apply(status, params) {
				let fun = ''
				if(this.type == 1) { // 单个商品售后
					params.goodsid = this.goods_id
					if(status == 1 || status == 2) { // 1退款  2退款退货
						params.type = status
						fun = 'after_sale_goods'
					}else if(status == 3) { // 3换货
						delete params.type
						fun = 'after_sale1'
					}
				}else if(this.type== 2) { // 订单售后
					params.type = status
					fun = 'after_sale_orders'
				}
				console.log(params);
				this.$ShowLoading()
				OrderCenterApi[fun](params).then(res=>{
					console.log('申请提交' , res)
					this.$HideLoading()
					this.$Toast(res.msg)
					if(res.code==1){
						uni.$emit('orderClick')
						uni.navigateBack()
					}
				})
			},
			confirm(e) {
				console.log(e);
				this.form.type = e[0].label
			},
			confirm1(e) {
				console.log(e);
				this.form.refundreason = e[0].label
			},
		}
	}
</script>

<style lang="scss" scoped>
.u-form-item {
	padding: 10rpx 0;
}
</style>
